<template>
	<view>
	<view class="a">
		<view class="a1">订单编号:</view>
		<view class="a2">773134832124563456</view>
		<view class="a1">订单金额</view>
		<view class="a2">{{num1}}元</view>
	</view>
	<view class="zf">
		<view>选择支付方式</view>
		<radio-group @change="b">
		<view class="zf1">
			<image src="../../../../static/icons/alipay.png"></image>
		    <view class="zf2">支付宝付款</view>
			<radio checked="true" value="alipay" color="#354E44"></radio>
		</view>
		<view class="zf1">
			<image src="../../../../static/icons/wxpay.png"></image>
		    <view class="zf2">微信付款</view>
			<radio value="wxpay" color="#354E44"></radio>
		</view>
		</radio-group>
	</view>
	<view class="lj" @tap='success'>立即支付</view>
	<view class="lj2">点击立即支付,即代表您同意<text><<条款协议>></text></view>
	</view>
</template>

<script>
	import {pay} from '../../../../util/user/user.js'
	export default{
		data(){
			return{
				num1:'',
				list1:[],
				user1:[],
				val:'',
				res2:''
			}
		},
		methods:{
			success(){
				pay({
					userId:this.user1.id,
					orderId:this.res2.data.orderId,
					orderType:this.val
				})
				.then(res=>{
					console.log(res)
				})
				uni.showToast({
					title:'支付成功'
				})
				uni.navigateTo({
					url:'/pages/user/cardlist/pay/pay2'
				})
				
				
			},
			b(v){
				console.log(v)
				this.val=v.detail.value
			}
			
		},
		onLoad() {
		  this.num1=uni.getStorageSync('num')
		  this.list1=uni.getStorageSync('list')
		  console.log(this.list1)
		  this.user1=uni.getStorageSync('userInfo')
		  console.log(this.user1)
		  this.res2=uni.getStorageSync('res')
		}
	}
</script>

<style>
	.a{
		width: 700rpx;
		margin: 30rpx auto;
		display: flex;
		justify-content: start;
		flex-wrap: wrap;
	}
	.a1{
		width: 20%;
		height:100rpx;
		color: grey;
	}
	.a2{
		width: 75%;
		height: 100rpx;
	}
	.zf{
		width: 700rpx;
		margin: 100rpx auto;
	}
	.zf1{
		display: flex;
		justify-content: start;
	}
	.zf1 image{
		width: 80rpx;
		height: 80rpx;
	}
	.zf2{
		width: 600rpx;
		height: 120rpx;
		line-height: 80rpx;
		margin-left: 20rpx;
	}
	.lj{
		width: 550rpx;
		height: 100rpx;
		border-radius: 100rpx;
		background-color: #354E44;
		color: white;
		margin: 0 auto;
		margin-top: 100rpx;
		text-align: center;
		line-height: 100rpx;
		font-size: 16px;
	}
	.lj2{
		width: 500rpx;
		margin: 10rpx auto;
		color: grey;
		font-size: 12px;
	}
	.lj2 text{
		color: skyblue;
	}
</style>
